<template>
	<view>
		<view id="app" class="app-height myBill">
		    <view class="bill-data">
		        <view class="bill-item" v-for="item in transLogList">
		            <view class="name-num">
		                <view class="p" >{{item.transTypeDesc}}</view><view class="span">{{item.operation+item.totalFee/100}}</view>
		            </view>
		            <view class="date-gold">
		                <view class="span" >{{item.updateAt?item.updateAt:item.createAt}}</view><view class="span" >{{'金币:'+item.balance/100}}</view>
		            </view>
		        </view>
		    </view>
		    <view class="connaught-style">
		        <view class="hint">暂无更多数据</view>
		    </view>
		</view>
	</view>
</template>

<script>
	import commonApi from '@/utils/commonMethod.js';
	
	export default {
		data() {
			return {
				queryMap:{
					transType:'',//交易类型
					transTime:'',//交易时间
				},
				transLogList:[],//账单列表
				
				currentUser:{},
				startTime:'', //进入页面时间
				endTime:'',//离开页面时间
				currentUrl:'',//当前页面全路径	
			}
		},
		onShow(){
				
			setTimeout(()=> {
				
				if (getApp().globalData.onShow) {
					getApp().globalData.onShow = 0;
					console.log("demo前后台切换之切到前台")
				}
				else {
					console.log("demo页面被切换显示")
					this.startTime = +new Date();
				}
				
			}, 100);
		},
		onHide(){
			setTimeout(() => {
				var that = this
				if (getApp().globalData.onHide) {
					getApp().globalData.onHide = 0;
					console.log("还在当前页面活动")
				}
				else {
					that.endTime = +new Date();
					console.log("demo页面停留时间：" + (that.endTime - that.startTime))
					var stayTime = Math.round((that.endTime - that.startTime)/1000);
				   //这里获取到页面停留时间stayTime，然后了可以上报了
				   this.saveFootPrint(stayTime);
				}
			}, 100)
		},
		onUnload(){
				setTimeout(() => {
				var that = this
				if (getApp().globalData.onHide) {
					getApp().globalData.onHide = 0;
					console.log("还在当前页面活动")
				}
				else {
					that.endTime = +new Date();
					console.log("demo页面停留时间：" + (that.endTime - that.startTime))
					var stayTime = Math.round((that.endTime - that.startTime)/1000);
				   //这里获取到页面停留时间stayTime，然后了可以上报了
				   this.saveFootPrint(stayTime);
				}
			}, 100)
		},
		async mounted() {
			 const currentUser = await commonApi.currentUserAxios();
			 this.currentUser = currentUser.data.session_user_h5;
			 
			 commonApi.getUserBills(this.queryMap).then(res=>{
				this.transLogList = res.data.list
			})
			const pages = getCurrentPages()
			const currentPage =pages[pages.length - 1]
			this.currentUrl = currentPage.$page.fullPath
			
			
		},
		methods: {
			  saveFootPrint(stayTime){
			      commonApi.saveFootPrint(this.currentUser.id,this.startTime,stayTime,this.currentUrl,"我的账单")
			  			
			  },

		}
	}
</script>

<style>
	.myBill .bill-data {
	    background-color: #ffffff;
	    padding: 0px 28rpx;
	}
	.myBill .bill-data .bill-item {
	    border-bottom: 1.5rpx solid #ededed;
	    padding: 21rpx 0px;
	}
	.name-num{
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
	}
	.myBill .bill-data .bill-item .name-num .p {
	    font-size: 15px;
	}.myBill .bill-data .bill-item .name-num .span {
		font-size: 15px;
		color: #029e9d;
	}
	.myBill .bill-data .bill-item .date-gold {
	    margin-top: 21rpx;
	    color: #8f9aa8;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		
	}
	.connaught-style .hint {
	    width: 100%;
	    font-size: 11px;
	    font-weight: 500;
	    color: #8f99a7;
	    line-height: 98rpx;
	    text-align: center;
	}
</style>